<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<title>报名页面</title>
		<!--		<link rel="stylesheet" type="text/css" href="../../css/api.css"/>-->
		<link rel="stylesheet" href="../../css/weui.min.css" />
		<link rel="stylesheet" href="../../css/mui.min.css" />
		<link rel="stylesheet" href="../../css/base.css"/>
		<style>
			input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea {
				line-height: 21px;
				width: 100%;
				height: 40px;
				margin-bottom: 15px;
				padding: 10px 15px;
				-webkit-user-select: text;
				border: 0px solid rgba(0,0,0,.2);
				border-radius: 3px;
				outline: 0;
				background-color: #fff;
				-webkit-appearance: none;
				/*   background-color:#F0F0F0;*/
			}
			p {
				display: block;
				-webkit-margin-before: 0em;
				-webkit-margin-after: 0em;
				-webkit-margin-start: 0px;
				-webkit-margin-end: 0px;
			}
			li {
				list-style-type: none;
				/*height: 51px;*/
				width: 100%;
			}
			ul, menu, dir {
				display: block;
				list-style-type: disc;
				-webkit-margin-before: 0em;
				-webkit-margin-after: 0em;
				-webkit-margin-start: 0px;
				-webkit-margin-end: 0px;
				-webkit-padding-start: 0px;
			}
			.list_ly {
				width: 100%;
				height: 50px;
				display: -webkit-box;
				background-color: #fff;
			}
			.list_ly_left {
				height: 50px;
				line-height: 50px;
				-webkit-box-flex: 1;
			}
			.list_ly_left p {
				padding-left: 15px;
			}
			.list_ly_right {
				height: 50px;
				line-height: 50px;
				-webkit-box-flex: 2;
				text-align: -webkit-right;
				margin-right: 15px;
			}
			.list_ly_type {
				height: 50px;
				line-height: 50px;
				-webkit-box-flex: 2;
				display: -webkit-box;
			}
			.list_ly_type_right {
				width: 120px;
				padding-right: 10px;
				text-align: -webkit-right;
			}
			.list_ly_type_right p {
				display: inline;
				padding-right: 10px;
			}
			.list_ly_type_right img {
				padding-bottom: 3px;
			}
			.list_ly_type_rights {
				width: 120px;
				padding-right: 10px;
				text-align: -webkit-right;
				line-height: 50px;
			}
			.list_ly_type_rights p {
				display: inline;
				padding-right: 10px;
				padding-left: 10px;
			}
			.list_ly_type_rights img {
				padding-bottom: 3px;
				height: 21px;
				width: 18px;
				top: 7px;
				position: relative;
			}
			.list_ly_right p {
			}
			.inputs {
				border: none;
				text-align: -webkit-right;
				outline: medium;
			}
			.sex {
				width: 40px;
				height: 26px;
				background-image: url(../../icon/icon_sex_s.png);
				line-height: 26px;
				text-align: -webkit-center;
				margin-top: 13px;
			}
			.but {
				top: 10px;
				background: #18B4ED;
				border: 1px solid #fff;
			}
		</style>
	</head>
	<body>
		<div class="base_style_color" id='BarAppearance' style="height: 22px;width: 100%; position:fixed; top:0px;"></div>
		<div class="base_navigation_bar base_style_color base_navigation_item_bar" style="position: fixed;top:22px;">
			<a class="base_left_item" href="#" onclick="backClick()"> <img class="base_back_icon" src="../../image/icon_jiantou.png" alt=""> </a>
			<span id="newsTitle">个人报名</span>
			<a class="base_right_item" onclick="loaddata()"> 提交 </a>
		</div>
		<div style="width: 100%;height: 100%;margin-top: 66px">
			<ul>
				<li>
					<div class="list_ly">
						<div class="list_ly_left">
							<p class="base_dark_grey base_content_font">
								账号
							</p>
						</div>
						<div class="list_ly_right">
							<samp class="base_dark_grey base_content_font" id="email_id"  ></samp>
							<!--	<p id="email_id">13582052094@163.com</p>-->
						</div>
					</div>
					<div class="div_divider"></div>
				</li>
				<li>
					<div class="list_ly">
						<div class="list_ly_left">
							<p class=" base_dark_grey base_content_font ">
								真实姓名
							</p>
						</div>
						<div class="list_ly_right">
							<input class="inputs base_dark_grey base_content_font" type="text"  id="name_id" placeholder="请输入真实姓名"/>
						</div>
					</div>
					<div class="div_divider"></div>
				</li>
				<li>
					<div class="list_ly">
						<div class="list_ly_left">
							<p class=" base_dark_grey base_content_font">
								性别
							</p>
						</div>
						<div class="list_ly_type">
							<div style="-webkit-box-flex:1;"></div>
							<div class="sex" id="sex_nan" onclick="chengesex(1)">
								<span style="font-size: 13px;">男</span>
							</div>
							<div style="width: 15px;"></div>
							<div class="sex" id="sex_nv" onclick="chengesex(0)">
								<span style="font-size: 13px;">女</span>
							</div><div style="width: 15px;"></div>
						</div>
					</div>
					<div class="div_divider"></div>
				</li>
				<li>
					<div class="list_ly">
						<div class="list_ly_left">
							<p class=" base_dark_grey base_content_font">
								身份证号
							</p>
						</div>
						<div class="list_ly_right">
							<input class="inputs base_dark_grey base_content_font" type="text"  id="idcard_id" placeholder="请输入身份证号" onkeyup="value=value.replace(/[^\w\.\/]/ig,'')">
						</div>
					</div>
					<div class="div_divider"></div>
				</li>
				<li>
					<div class="list_ly">
						<div class="list_ly_left">
							<p class=" base_dark_grey base_content_font">
								学历
							</p>
						</div>
						<div class="list_ly_type" onclick="xueli()">
							<div style="-webkit-box-flex:1;"></div>
							<div class="list_ly_type_right">
								<p id="xueli_id">
									高职
								</p><img src="../../icon/icon_type_jth.png"/>
							</div>
						</div>
					</div>
					<div class="div_divider"></div>
				</li>
				<li>
					<div class="list_ly">
						<div class="list_ly_left">
							<p class=" base_dark_grey base_content_font">
								个人经历
							</p>
						</div>
						<div class="list_ly_type">
							<div style="-webkit-box-flex:1;"></div>
							<div class="list_ly_type_rights" onclick="chengejl(1)">
								<img id="stu" src="../../icon/icon_checkon.png"/>
								<p class="list_ly_type_rightjp">
									学生
								</p>
							</div>
							<div class="list_ly_type_rights" onclick="chengejl(0)">
								<img id="shry" src="../../icon/icon_checkup.png"/>
								<p class="list_ly_type_rightjp">
									社会人员
								</p>
							</div>
						</div>
					</div>
					<div class="div_divider"></div>
				</li>
				<li>
					<div class="list_ly">
						<div class="list_ly_left">
							<p class="base_dark_grey base_content_font">
								学校/单位
							</p>
						</div>
						<div class="list_ly_right">
							<input class="inputs base_dark_grey base_content_font" type="text"  id="company_id" placeholder="请输入所在学校/单位" />
						</div>
					</div>
					<div class="div_divider"></div>
				</li>
				<li>
					<div class="list_ly">
						<div class="list_ly_left">
							<p class="base_dark_grey base_content_font">
								联系地址
							</p>
						</div>
						<div class="list_ly_right">
							<input class="inputs base_dark_grey base_content_font" type="text"  id="address_id" placeholder="请输入地址" />
						</div>
					</div>
					<div class="div_divider"></div>
				</li>
				<li>
					<div class="list_ly">
						<div class="list_ly_left">
							<p class="base_dark_grey base_content_font">
								手机
							</p>
						</div>
						<div class="list_ly_right">
							<input class="inputs base_dark_grey base_content_font" type="text" id="phone_id" placeholder="请输入手机号" onkeyup="this.value=this.value.replace(/\D/g,'')" />
						</div>
					</div>
					<div class="div_divider"></div>
				</li>
				<li>
					<div class="list_ly">
						<div class="list_ly_left">
							<p class="base_dark_grey base_content_font">
								短信验证
							</p>
						</div>
						<div class="list_ly_right ">
							<input class="inputs base_dark_grey base_content_font"  style="width: 120px" type="tel" maxlength="6"  id='editcode'  placeholder="请输入验证码" onkeyup="this.value=this.value.replace(/\D/g,'')"/>
							<button style="color: #FFFFFF "  type="botton" onclick="send()" id ='sendcode' class="but font12 "   hidefocus="hidefocus">
								获取验证码
							</button>
						</div>
					</div>
		</div>
		<div class="div_divider"></div>
		</li>
		<li>
			<div class="list_ly">
				<div class="list_ly_left">
					<p class="base_dark_grey base_content_font">
						电子版身份证明
					</p>
				</div>
				<div class="list_ly_right" onclick="getidpic()">
					<div style="width: 100px;height: 100%;text-align: -webkit-right;"><img style="padding-top: 16px; "   id ="idcard" src="../../icon/icon_idcard.png" />
						<em id="idcard_span" style="display: none;"  class="font12 base_dark_grey ">已上传</em>
						<img style="padding-left: 10px;padding-bottom: 2px;height: 16px;" src="../../icon/icon_fanjt.png" />
					</div>
				</div>
			</div>
			<div class="div_divider"></div>
		</li>
		<li>
			<div class="list_ly">
				<div class="list_ly_left">
					<p class="base_dark_grey base_content_font">
						报名费
					</p>
				</div>
				<div class="list_ly_right">
					<p>
						<span style="color: red" id="money_id">0</span>
					</p>
				</div>
			</div>
			<div class="div_divider"></div>
		</li>
		</ul>
		</div>
		<div id="picture" class="mui-popover mui-popover-action mui-popover-bottom">
			<ul class="mui-table-view">
				<li class="mui-table-view-cell">
					<a href="#" typeid="0">拍照</a>
				</li>
				<li class="mui-table-view-cell">
					<a href="#" typeid="1">从相册选取</a>
				</li>
			</ul>
			<ul class="mui-table-view">
				<li class="mui-table-view-cell">
					<a href="#picture" typeid="2"><b>取消</b></a>
				</li>
			</ul>
		</div>
		<div id="xueli" class="mui-popover mui-popover-action mui-popover-bottom">
			<ul class="mui-table-view">
				<li class="mui-table-view-cell">
					<a href="#" typeids="1">中职</a>
				</li>
				<li class="mui-table-view-cell">
					<a href="#" typeids="2">高职</a>
				</li>
				<li class="mui-table-view-cell">
					<a href="#" typeids="3">本科</a>
				</li>
				<li class="mui-table-view-cell">
					<a href="#" typeids="4">硕士</a>
				</li>
				<li class="mui-table-view-cell">
					<a href="#" typeids="5">博士</a>
				</li>
			</ul>
			<ul class="mui-table-view">
				<li class="mui-table-view-cell">
					<a href="#xueli" typeids="2"><b>取消</b></a>
				</li>
			</ul>
		</div>
		<!--	<ul class="mui-table-view">
		<li id="offline_btn" class="mui-table-view-cell base_title_font base_grey">
		退出账号
		</li>
		</ul>
		</div>-->
		<div id="offlineAlert" class="weui_dialog_confirm" style="display: none;">
			<div class="weui_mask"></div>
			<div class="weui_dialog">
				<div class="weui_dialog_hd">
					<strong class="weui_dialog_title">您是否退出当前界面？</strong>
				</div>
				<div class="weui_dialog_bd"></div>
				<div class="weui_dialog_ft">
					<a onclick="cleanCancel()" href="#" class="weui_btn_dialog default"  style="color:#18b4ed">取消</a>
					<a onclick="cleanConfirm()" href="#" class="weui_btn_dialog primary"  style="color:#18b4ed">确定</a>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/jquery.min.js"></script>
	<script type="text/javascript" src="../../script/mui.min.js"></script>
	<script type="text/javascript" src="../../script/common.js"></script>
	<script type="text/javascript" src="../../script/MD5.js"></script>
	<script type="text/javascript" src="../../script/processing_images.js"></script>
	<script type="text/javascript" src="../../script/requestTool.js"></script>
	<script type="text/javascript">
		mui.init();
		var phon_id = '';
		var currentCode = '';
		//当前验证码
		var experience = '1';
		//默认是学生 1-学生  2-社会人员
		var sex = '2';
		//性别 1-男; 2-女
		var education = '2';
		//1：中值   2：高职  3.本科 4.硕士  5.博士
		var papers = '';
		var pic_uir = 0;
		//身份证明   0：未上传  1：已经上传 2：正在上传
		//证件路径
		var time = 0;
		var timer;
		var type = '';
		//1:第一次报名  2：重新报名
		apiready = function() {
			SendBehaviorTrajectoriesNotifi1(0, '岗位报名', '122', api.pageParam.sourceurl, api.pageParam.sourcetitle, window.location.pathname, document.title);
			settypedata();
			miuilist();
			miuixueli();
		};
		function settypedata() {
			$('#email_id').html($api.getStorage("cfnetemail"));
			type = api.pageParam.type;
			if (type == 1) {//第一次报名
				$('#name_id').html($api.getStorage("cfnetpprealname"));
				chengesex(1);
			} else {//重新报名
				getApplyDet();
			}
			var money = $api.getStorage("pay_money");
			if (money != "") {
				$('#money_id').html("￥" + money);
			}
		}

		function ApplyDetdata(data) {
			pic_uir = 1;
			$('#phone_id').val(data.phone);
			$('#name_id').val(data.name);
			sex = data.sex;
			chengesex(data.sex);
			//学历
			education = data.education;
			if (education == 1) {
				$('#xueli_id').html('中职');
			} else if (education == 2) {
				$('#xueli_id').html('高职');
			} else if (education == 3) {
				$('#xueli_id').html('本科');
			} else if (education == 4) {
				$('#xueli_id').html('硕士');
			} else if (education == 5) {
				$('#xueli_id').html('博士');
			}
			experience = data.experience;
			chengejl(experience);
			$('#idcard_id').val(data.idcard);
			$('#company_id').val(data.company);
			$('#address_id').val(data.address);
			papers = data.papers;
		}

		//获取报名信息
		function getApplyDet() {
			var params = {
				uid : $api.getStorage('cfnetppuid'),
				quarter_id : api.pageParam.id,
				jid : "58"
			}
			showProgress();
			//			alert(JSON.stringify(params));
			cfnetppPOST(url_getApplyDet, params, true, function(data, status) {
				//				 alert(JSON.stringify(data));
				hideProgress();
				if (status == 'success') {
					if (data.code == 200) {
						ApplyDetdata(data.data);
					}
				}
			})
		}

		//发送验证吗
		function send() {
			phon_id = $("#phone_id").val();
			if (phon_id.length == 11) {
				time = 59;
				timeCountDown();
				timer = setInterval(timeCountDown, 1000);
				sendCode();
			} else {
				api.toast({
					msg : '请输入正确的手机号码'
				});
			}
		}

		function timeCountDown() {
			if (time == 0) {
				clearInterval(timer);
				$("#sendcode").attr("disabled", false);
				$("#sendcode").css("background", "#18B4ED");
				$('#sendcode').html("再次发送验证码");
				return true;
			}
			$("#sendcode").css("background", "#929292");
			//
			$("#sendcode").attr("disabled", true);
			//
			$('#sendcode').html(time + "S后再次发送");
			time--;
			//倒计时
			return false;
		}

		//获取验证吗
		function sendCode() {
			currentCode = getCode();
			var timecode = Date.parse(new Date);
			var token = MD5("cfnetsms" + timecode);
			var url = 'http://boscache.cfnet.org.cn/sms/smsauth.php' + '?timecode=' + timecode + '&token=' + token + '&tel=' + phon_id + '&authcode=' + currentCode;
			api.ajax({
				tag : 'code',
				url : url
			}, function(ret, err) {
				//				 alert('ret:'+JSON.stringify(ret)+'err:'+JSON.stringify(err));
				api.cancelAjax({
					tag : 'code'
				});
			});
		}

		function getCode() {//获取验证码
			return getRandom(8999) + 1000;
		}

		//个人经历
		function chengejl(type) {
			if (type == "1") {
				$("#stu").attr('src', '../../icon/icon_checkon.png');
				$("#shry").attr('src', '../../icon/icon_checkup.png');
				experience = '1'
			} else {
				$("#stu").attr('src', '../../icon/icon_checkup.png');
				$("#shry").attr('src', '../../icon/icon_checkon.png');
				experience = '2'
			}
		}

		//性别
		function chengesex(type) {
			if (type == "1") {
				$("#sex_nan").css("background-image", "url(../../icon/icon_sex_s.png)");
				$("#sex_nv").css("background-image", "url(../../icon/icon_sex_n.png)");
				sex = '1'
			} else {
				$("#sex_nv").css("background-image", "url(../../icon/icon_sex_s.png)");
				$("#sex_nan").css("background-image", "url(../../icon/icon_sex_n.png)");
				sex = '2'
			}
		}

		function getidpic() {
			mui('#picture').popover('toggle');
		}

		function xueli() {
			mui('#xueli').popover('toggle');
		}

		//学历
		//1：中值   2：高职  3.本科 4.硕士  5.博士
		function miuixueli() {
			mui('body').on('tap', '.mui-popover-action li>a', function() {
				var typeid = $(this).attr('typeids');
				if (typeid == 1) {//选择专科
					mui('#xueli').popover('toggle');
					$('#xueli_id').html('中职');
					education = '1';
				} else if (typeid == 2) {//选择本科
					mui('#xueli').popover('toggle');
					$('#xueli_id').html('高职');
					education = '2';
				} else if (typeid == 3) {//选择专科
					mui('#xueli').popover('toggle');
					$('#xueli_id').html('本科');
					education = '3';
				} else if (typeid == 4) {//选择本科
					mui('#xueli').popover('toggle');
					$('#xueli_id').html('硕士');
					education = '4';
				} else if (typeid == 5) {//选择本科
					mui('#xueli').popover('toggle');
					$('#xueli_id').html('博士');
					education = '5';
				}
			});
		}

		function miuilist() {
			$('#idcard').show();
			$('#idcard_span').hide();
			mui('body').on('tap', '.mui-popover-action li>a', function() {
				var typeid = $(this).attr('typeid');
				if (typeid == 0) {//拍照
					mui('#picture').popover('toggle');
					api.getPicture({
						sourceType : 'camera',
						encodingType : 'jpg',
						mediaValue : 'pic',
						destinationType : 'url',
						allowEdit : true,
						quality : 50,
						saveToPhotoAlbum : false
					}, function(ret, err) {
						if (ret) {
							var photoPath = ret.data;
							if (photoPath != '') {
								addpatrol(photoPath);
							}
						} else {
						}
					});
				} else if (typeid == 1) {//从相册选择
					mui('#picture').popover('toggle');
					api.getPicture({
						sourceType : 'album',
						encodingType : 'jpg',
						mediaValue : 'pic',
						destinationType : 'url',
						allowEdit : true,
						quality : 50,
						saveToPhotoAlbum : false
					}, function(ret, err) {
						if (ret) {
							var photoPath = ret.data;
							if (photoPath != '') {
								addpatrol(photoPath);
							}
						} else {
						}
					});
				}
			});
		}

		//返回
		function backClick() {
			$('#offlineAlert').show();
		}

		//取消
		function cleanCancel() {
			$('#offlineAlert').hide();
		}

		//确定
		function cleanConfirm() {
			api.closeWin({
			});
			SendBehaviorTrajectoriesNotifi1(1, '岗位报名', '122', api.pageParam.sourceurl, api.pageParam.sourcetitle, window.location.pathname, document.title);
		}

		//上传图片
		function addpatrol(compressImg) {
			pic_uir = 2;
			UploadFile_ali(Upload_File_img,compressImg, function(ret) {
				$('#idcard').hide();
				$('#idcard_span').show();
				pic_uir = 1;
				papers = ret.fileurl;
			});
		}

		//提交数据
		/**
		 *jid     : 集团id
		 uid     : 用户id
		 name				姓名
		 email				邮箱
		 sex			性别 1-男; 2-女
		 idcard			身份证号
		 education			学历
		 company			所在单位
		 address			联系地址
		 phone			联系电话
		 papers				证件路径
		 quarter_id			当前职位
		 Experience   个人经历 1-学生  2-社会人员
		 *  */
		function loaddata() {
			var editcode = $('#editcode').val();
			var editTel = $('#phone_id').val();
			if ($api.trimAll(editcode) == '' || editTel == '') {
				api.toast({
					msg : '手机号或验证码不能为空！'
				});
				return;
			}
			if (editcode != currentCode) {
				api.toast({
					msg : '验证码错误！'
				});
				return;
			}
			var nickname = $('#name_id').val();
			if ($api.trimAll(nickname) == '') {
				api.toast({
					msg : '请输入真实姓名！'
				});
				return;
			}
			var idcard = $('#idcard_id').val();
			if ($api.trimAll(idcard) == '') {
				api.toast({
					msg : '身份证明不能为空！'
				});
				return;
			}
			if (idcard.length != 18) {
				api.toast({
					msg : '身份证号不正确！'
				});
				return;
			}
			var company = $('#company_id').val();
			if ($api.trimAll(company) == '') {
				api.toast({
					msg : '学校或者单位不能为空！'
				});
				return;
			}
			var address = $('#address_id').val();
			if ($api.trimAll(address) == '' && address.length > 4) {
				api.toast({
					msg : '地址不能为空！'
				});
				return;
			}
			if (pic_uir == 0) {
				api.toast({
					msg : '电子版身份证不能为空'
				});
				return;
			}
			if (pic_uir == 2) {
				api.toast({
					msg : '稍等片刻电子版身份证正在上传中'
				});
				return;
			}
			var params = {
				uid : $api.getStorage('cfnetppuid'),
				jid : 52,
				email : $api.getStorage("cfnetemail"),
				name : nickname,
				sex : sex,
				idcard : idcard,
				education : education,
				company : company,
				address : address,
				phone : editTel,
				quarter_id : api.pageParam.id,
				experience : experience,
				papers : papers,
				message : '报名'+api.pageParam.quarter_name + '认证',
			};
			//			 alert(JSON.stringify(params));
			cfnetppPOST(url_Addapply, params, true, function(data, status) {
				hideProgress();
				SendBusinessOperationsLogNotifi('岗位报名页', '122', params, params, '', data, '岗位报名接口', '122-01')
				if (status == 'success') {
					if (data.code == 200) {
						//发送学习状态的通知
						api.sendEvent({
							name : 'ispay',
							extra : {
								ispay : "0",
								learn_plan : ""
							}
						});
						//刷新我的认证
						api.sendEvent({
							name : 'sendrefreshdata'
						});
						if (type == 1) {
							//打开支付页
							api.openWin({useWKWebView:true,
								name : 'Upload_Order',
								url : 'Upload_Order.html',
								pageParam : {
									sourceurl : window.location.pathname,
									sourcetitle : document.title
								}
							});
						} else if (type == 2) {
							api.sendEvent({
								name : 'jumpPage',
								extra : {
									page : 3
								}
							});
							api.closeWin({
							});
							api.closeWin({
								name : "Detaila"
							});
						}
						SendBehaviorTrajectoriesNotifi(1, '岗位报名', '122');
					} else if (data.code == 132) {
						ShowToast('已经报名过');
					} else if (data.code == 109) {
						ShowToast('失败');
					} else if (data.code == 131) {
						ShowToast('没有此岗位');
					}
				} else {
					ShowToast('网络异常请检查网络');
				}
			});
		}
	</script>
</html>